<template>
    <div id="tmpl">
<div  class='cart' v-for="(item,index) in list">
  <mt-switch :value.sync="value[index]"></mt-switch>
  <img class="img" :src="item.img_url" alt="商品图片">
  <div class="inforight">
  <h4>{{item.title}}</h4>
  <ul>
    <li style="color: red">￥{{item.sell_price}}</li>&nbsp;&nbsp;
    <li>购买数量组件</li>
    <li class="del"><a href="javascript:void(0)">删除</a></li>
  </ul>
  </div>
</div>
    </div>
</template>

<script>
    export default{
      data(){
          return{
              value:[],
              list:[
                {
                    'id':1,
                  'title':'华为荣耀6plus 16g双核',
                  'sell_price':2195,
                  'img_url':'https://g-search1.alicdn.com/img/bao/uploaded/i4/imgextra/i2/34471900/TB22XCaaC_I8KJjy0FoXXaFnVXa_!!0-saturn_solar.jpg_230x230.jpg'
                },

                {
                  'id':2,
                  'title':'苹果x6plus 36g双核',
                  'sell_price':2396,
                  'img_url':'https://g-search1.alicdn.com/img/bao/uploaded/i4/imgextra/i2/13022581/TB2Q.rgeGigSKJjSsppXXabnpXa_!!0-saturn_solar.jpg_230x230.jpg'
                },

              ]
          }
      },
    }
</script>

<style scoped>
.cart{
  height: 100px;
  border-bottom: 1px solid black;
  display: flex;
}
  .img{
    width: 95px;
    height: 95px;
    margin-left: 20px;
  }
  .cart li{
    list-style: none;
    display:inline-block;
  }
  .inforight ul{
    padding-left: 0;
    flex:0 0 50px;
    margin-top: 20px;

  }
  .inforight{
    margin-left: 50px;
    margin-top: 10px;
  }
  .inforight h4{
    color:#0094ff;
  }
  .del{
    margin-left: 20px;
  }
</style>
